﻿<!doctype html>
<html lang="en">

<head>

    <!--====== Required meta tags ======-->
    <meta charset="utf-8">
    <meta http-equiv="x-ua-compatible" content="ie=edge">
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!--====== Title ======-->
    <title>HaFood</title>

    <!--====== Bootstrap css ======-->
    <link rel="stylesheet" href="/static/index/css/bootstrap.min.css">

    <!--====== Pe Icon 7 Stroke css ======-->
    <link rel="stylesheet" href="/static/index/css/Pe-icon-7-stroke.css">

    <!--====== Ion Icons css ======-->
    <link rel="stylesheet" href="/static/index/css/ionicons.min.css">

    <!--====== Magnific Popup css ======-->
    <link rel="stylesheet" href="/static/index/css/magnific-popup.css">

    <!--====== Slick css ======-->
    <link rel="stylesheet" href="/static/index/css/slick.css">

    <!--====== Animate css ======-->
    <link rel="stylesheet" href="/static/index/css/animate.min.css">

    <!--====== Nice Select css ======-->
    <link rel="stylesheet" href="/static/index/css/nice-select.css">

    <!--====== Default css ======-->
    <link rel="stylesheet" href="/static/index/css/default.css">

    <!--====== Style css ======-->
    <link rel="stylesheet" href="/static/index/css/style.css">


</head>

<body>

    <!--====== PRELOADER  PART START ======-->

    <div id="preloader">
        <div id="loader">
            <span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span><span></span>
        </div>
    </div>

    <!--====== PRELOADER  PART ENDS ======-->

    <!--====== SEARCH PART START ======-->

    <div class="search-box">
        <div class="search-header">
            <div class="container mt-60">
                <div class="row">
                    <div class="col-6">
                        <h5 class="search-title">Search</h5> <!-- search title -->
                    </div>
                    <div class="col-6">
                        <div class="search-close text-right">
                            <button class="search-close-btn">Close <span></span><span></span></button>
                        </div> <!-- search close -->
                    </div>
                </div> <!-- row -->
            </div> <!-- container -->
        </div> <!-- search header -->
        <div class="search-body">
            <div class="container">
                <div class="row">
                    <div class="col-lg-12">
                        <div class="search-form">
                            <form action="#">
                                <input type="text" placeholder="Search for Products">
                                <button><i class="flaticon-search"></i></button>
                            </form>
                        </div>
                    </div>
                </div> <!-- row -->
            </div> <!-- container -->
        </div> <!-- search body -->
    </div>

    <!--====== SEARCH PART ENDS ======-->

    <!--====== SHOPPING CART PART START ======-->

    <div class="shopping-cart-wrapper">
        <div class="shopping-cart-canvas">
            <div class="shopping_cart">
                <div class="shopping_cart-top-bar d-flex justify-content-between">
                    <h6>Shopping Cart</h6>
                    <button class="shopping-cart-close">
                        <i class="ion ion-md-add"></i>
                    </button>
                </div><!-- shopping cart top bar -->
                <div class="shopping_cart-list-items mt-30">
                    <ul>
                        <li>
                            <div class="single-shopping-cart media">
                                <div class="cart-image">
                                    <img src="/static/index/images/cart-1.jpg" alt="Cart">
                                </div>
                                <div class="cart-content media-body pl-15">
                                    <h6><a href="#">Banana</a></h6>
                                    <span class="quality">QTY: 01</span>
                                    <span class="price">$205.00</span>
                                    <a class="remove" href="#"><i class="fal fa-times"></i></a>
                                </div>
                            </div> <!-- single shopping cart -->
                        </li>
                        <li>
                            <div class="single-shopping-cart media">
                                <div class="cart-image">
                                    <img src="/static/index/images/cart-2.jpg" alt="Cart">
                                </div>
                                <div class="cart-content media-body pl-15">
                                    <h6><a href="#">Grape</a></h6>
                                    <span class="quality">QTY: 01</span>
                                    <span class="price-discount">$205.00</span>
                                    <span class="price-close">$205.00</span>
                                    <a class="remove" href="#"><i class="fal fa-times"></i></a>
                                </div>
                            </div> <!-- single shopping cart -->
                        </li>
                    </ul>
                </div> <!-- shopping_cart list items -->
                <div class="shopping_cart-btn">
                    <div class="total pt-35 d-flex justify-content-between">
                        <h5>Subtotal:</h5>
                        <p>$240.00</p>
                    </div>
                    <div class="cart-btn pt-25">
                        <a class="main-btn" href="com_car.html">查看购物车</a>
                    <a class="main-btn main-btn-2" href="checkout.html">立即结算</a>
                    </div>
                </div>
            </div> <!-- shopping_cart -->
        </div>
        <div class="overlay"></div>
    </div>

    <!--====== SHOPPING CART PART ENDS ======-->


    <!--====== HEADER  PART START ======-->

    <header class="header-area">
        <div class="navigation navigation-2 navigation-page fixed-top">
            <div class="container">
                <div class="row">
                    <div class="col-lg-12">
                        <nav class="navbar navbar-expand-lg">
                            <a class="navbar-brand" href="index.html">
                                <img src="/static/index/images/logo.png" alt="Logo">
                            </a> <!-- Logo -->

                            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
                                <span class="toggler-icon"></span>
                                <span class="toggler-icon"></span>
                                <span class="toggler-icon"></span>
                            </button> <!-- navbar-toggler -->

                            <div class="collapse navbar-collapse sub-menu-bar" id="navbarSupportedContent">
                                <ul class="navbar-nav mr-auto">
                                     <li class="nav-item"><a href="index.html">主页</a></li>
                                <li class="nav-item"><a href="product-grid.html">全部商品</a></li>
                                <li class="nav-item"><a class="page-scroll" href="#">最新活动</a></li>
                                <li class="nav-item"><a class="page-scroll" href="#">会员俱乐部</a></li>
                                </ul>
                            </div> <!-- navbar collapse -->
                            <div class="navbar-icon d-none d-sm-block">
                                <ul>
                                    <li><a class="search-open" href="#"><i class="pe-7s-search"></i></a></li>
                                    <li><a class="shopping-cart-open" href="#"><i class="pe-7s-cart"></i></a></li>
                                </ul>
                            </div>
                        </nav> <!-- navbar -->
                    </div>
                </div> <!-- row -->
            </div> <!-- container -->
        </div> <!-- navigation -->
    </header>

    <!--====== HEADER  PART ENDS ======-->

    <!--====== PAGE TITLE  PART START ======-->

    <section class="page-title-area d-flex align-items-center bg_cover" style="background-image: url(/static/index/images/page-title-bg.jpg)">
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    <div class="page-title-item text-center">
                        <h3 class="title">Contact Us</h3>
                        <nav aria-label="breadcrumb">
                            <ol class="breadcrumb">
                                <li class="breadcrumb-item"><a href="index.html">Home</a></li>
                                <li class="breadcrumb-item active" aria-current="page">Contact Us</li>
                            </ol>
                        </nav>
                    </div> <!-- page title item -->
                </div>
            </div> <!-- row -->
        </div> <!-- row -->
        <div class="page-title-shape">
            <img src="/static/index/images/banner-shape.png" alt="shape">
        </div> <!-- page title shape -->
    </section>

    <!--====== PAGE TITLE  PART ENDS ======-->

    <!--====== CONTACT INFO PART START ======-->
    
    <section class="contact-info-area pt-35 pb-85">
        <div class="container">
            <div class="row justify-content-center">
                <div class="col-lg-4 col-md-4 col-sm-6">
                    <div class="contact-info-item text-center mt-30">
                        <i class="ion ion-md-map"></i>
                        <h6 class="title">Address</h6>
                        <p>82 Valley Farms Court</p>
                    </div>
                </div>
                <div class="col-lg-4 col-md-4 col-sm-6">
                    <div class="contact-info-item text-center icon mt-30">
                        <i class="ion ion-md-call"></i>
                        <h6 class="title">Phone Number</h6>
                        <p>(546) 347-9636</p>
                    </div>
                </div>
                <div class="col-lg-4 col-md-4 col-sm-6">
                    <div class="contact-info-item text-center mt-30">
                        <i class="ion ion-md-mail"></i>
                        <h6 class="title">Email</h6>
                        <p>sswstudio@gmail.com</p>
                    </div>
                </div>
            </div>
        </div>
    </section> 

    <!--====== CONTACT INFO PART ENDS ======-->
    
    <!--====== CONTACT INFO PART ENDS ======-->  
        <div class="map-area">
            <iframe src="https://ditu.google.cn/maps/embed?pb=!1m18!1m12!1m3!1d387190.2799160891!2d-74.25987584510595!3d40.69767006338158!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x89c24fa5d33f083b%3A0xc80b8f06e177fe62!2sNew%20York%2C%20NY%2C%20USA!5e0!3m2!1sen!2sbd!4v1570861327378!5m2!1sen!2sbd" width="600" height="450" style="border:0;" allowfullscreen=""></iframe>
        </div>
    <!--====== CONTACT INFO PART ENDS ======-->
    
    <!--====== CONTACT TOUCH PART START ======-->
    
    <section class="contact-touch-area pt-85 pb-90">
        <div class="container">
            <div class="row align-items-center">
               <div class="col-lg-3">
                   <div class="contact-touch-thumb d-none d-lg-block">
                       <img src="/static/index/images/contact-touch-thumb.jpg" alt="contact">
                   </div>
               </div>
                <div class="col-lg-9">
                    <div class="contact-touch-part">
                        <div class="row">
                            <div class="col-lg-12">
                                <div class="secton-title text-center">
                                    <h5 class="title">Get in touch</h5>
                                    <p>Lorem Ipsum is not simply random text. </p>
                                </div>
                            </div>
                        </div>
                        <form id="contact-form" action="/static/contact.php" method="post">
                            <div class="row">
                                <div class="col-lg-6">
                                    <div class="input-box mt-35">
                                        <input name="name" type="text" placeholder="Your name">
                                    </div>
                                </div>
                                <div class="col-lg-6">
                                    <div class="input-box mt-35">
                                        <input name="email" type="email" placeholder="Your Email">
                                    </div>
                                </div>
                                <div class="col-lg-12">
                                    <div class="input-box mt-35 text-center">
                                        <textarea name="message" id="#" cols="30" rows="10" placeholder="Message"></textarea>
                                        <button type="submit">Submit</button>
                                    </div>
                                </div>
                            </div>
                        </form>
                        <p class="form-message"></p>
                    </div>
                </div>
            </div>
        </div>
    </section> 

    <!--====== CONTACT TOUCH PART ENDS ======-->
    
    <!--====== FOOTER PART START ======-->

    <section class="footer-area gray-bg pt-60 pb-85">
        <div class="container">
            <div class="row">
                <div class="col-lg-4 col-md-5">
                    <div class="footer-item-1 mt-30">
                        <a href="index.html"><img src="/static/index/images/logo-2.png" alt="logo"></a>
                        <span>Copyright &copy; 2019.Company name All rights reserved.<a target="_blank" href="http://sc.chinaz.com/moban/">&#x7F51;&#x9875;&#x6A21;&#x677F;</a></span>
                        <ul>
                            <li><a href="#">Quality policy</a></li>
                            <li><a href="#">Customer Policy </a></li>
                            <li><a href="#">About Us</a></li>
                        </ul>
                        <div class="footer-info">
                            <ul>
                                <li><i class="ion ion-md-pin"></i> 123 New Design Str, ABC Building, <br> Melbourne, Australia</li>
                                <li><i class="ion ion-ios-mail"></i>example@gmail.com</li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="col-lg-2 offset-lg-2 col-md-2 col-sm-4">
                    <div class="footer-social mt-30">
                        <h5 class="title">Social Links</h5>
                        <ul>
                            <li><a href="https://www.facebook.com/info.tanver">Facebook</a></li>
                            <li><a href="#">Twitter</a></li>
                            <li><a href="#">Instagram</a></li>
                            <li><a href="skype:live:taherul.islam_1">Skype</a></li>
                        </ul>
                    </div>
                </div>
                <div class="col-lg-4 col-md-5 col-sm-8">
                    <div class="footer-item-2 mt-30">
                        <h5 class="title">Newsletters</h5>
                        <form action="#">
                            <div class="input-box mt-25">
                                <input type="email" placeholder="Your email">
                            </div>
                            <div class="input-box mt-25">
                                <button class="main-btn">Submit <i class="ion ion-ios-send"></i></button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!--====== FOOTER PART ENDS ======-->

    <!--====== BACK TO TOP ======-->
    <div class="back-to-top">
        <a href="">
            <i class="ion ion-md-arrow-up"></i>
        </a>
    </div>
    <!--====== BACK TO TOP ======-->


    <!--====== jquery js ======-->
    <script src="/static/index/js/vendor/modernizr-3.6.0.min.js"></script>
    <script src="/static/index/js/vendor/jquery-1.12.4.min.js"></script>

    <!--====== Bootstrap js ======-->
    <script src="/static/index/js/bootstrap.min.js"></script>
    <script src="/static/index/js/popper.min.js"></script>

    <!--====== Slick js ======-->
    <script src="/static/index/js/slick.min.js"></script>

    <!--====== Isotope js ======-->
    <script src="/static/index/js/isotope.pkgd.min.js"></script>

    <!--====== Images Loaded js ======-->
    <script src="/static/index/js/imagesloaded.pkgd.min.js"></script>

    <!--====== Magnific Popup js ======-->
    <script src="/static/index/js/jquery.magnific-popup.min.js"></script>

    <!--====== Nice Select js ======-->
    <script src="/static/index/js/jquery.nice-select.min.js"></script>

    <!--====== Ajax Contact js ======-->
    <script src="/static/index/js/ajax-contact.js"></script>

    <!--====== Main js ======-->
    <script src="/static/index/js/main.js"></script>

</body>

</html>

